<!DOCTYPE html>
<html lang="ko">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<title>테이블</title>
	</head>
	<body>
		<h1>테이블</h1>
		<table style="width:850px" border="1" cellpadding="5" cellspacing="5">
			<caption>게시판</caption>
			<colgroup style="background: orange">
				<col style="width:10%" />			
				<col />			
				<col style="width:15%; background: gray" />			
				<col style="width:15%" />			
				<col style="width:10%" />			
			</colgroup>
			
			<tr>
				<th>번호</th><th>제목</th><th>작성자</th><th>작성일</th><th>조회</th>
			</tr>
			<tr>
				<td>1</td>
				<td>롯데리아, 오징어 버거 1200원 </td>
				<td>니냐뇨</td>
				<td>2013. 12. 12</td>
				<td>10356996</td>
			</tr>
			<tr>
				<td>2</td>
				<td>롯데리아, 오징어 버거 1200원 </td>
				<td>니냐뇨</td>
				<td>2013. 12. 12</td>
				<td>10356996</td>
			</tr>
			<tr>
				<td>3</td>
				<td>롯데리아, 오징어 버거 1200원 </td>
				<td>니냐뇨</td>
				<td>2013. 12. 12</td>
				<td>10356996</td>
			</tr>
			<tr>
				<td>4</td>
				<td>롯데리아, 오징어 버거 1200원 </td>
				<td>니냐뇨</td>
				<td>2013. 12. 12</td>
				<td>10356996</td>
			</tr>
			<tr>
				<td>5</td>
				<td>롯데리아, 오징어 버거 1200원 </td>
				<td>니냐뇨</td>
				<td>2013. 12. 12</td>
				<td>10356996</td>
			</tr>
			<tr>
				<td>6</td>
				<td>롯데리아, 오징어 버거 1200원 </td>
				<td>니냐뇨</td>
				<td>2013. 12. 12</td>
				<td>10356996</td>
			</tr>
			<tr>
				<td>7</td>
				<td>롯데리아, 오징어 버거 1200원 </td>
				<td>니냐뇨</td>
				<td>2013. 12. 12</td>
				<td>10356996</td>
			</tr>
			<tr>
				<td>8</td>
				<td>롯데리아, 오징어 버거 1200원 </td>
				<td>니냐뇨</td>
				<td>2013. 12. 12</td>
				<td>10356996</td>
			</tr>
			<tr>
				<td>9</td>
				<td>롯데리아, 오징어 버거 1200원 </td>
				<td>니냐뇨</td>
				<td>2013. 12. 12</td>
				<td>10356996</td>
			</tr>
			<tr>
				<td>10</td>
				<td>롯데리아, 오징어 버거 1200원 </td>
				<td>니냐뇨</td>
				<td>2013. 12. 12</td>
				<td>10356996</td>
			</tr>
		</table>
		
		<hr />
		
		<table style="width: 350px" border="1">
			<caption>지역별 홍차</caption>
			<colgroup>
				<col />
				<col />
			</colgroup>
			<tr><th colspan="2">지역별 홍차</th><!--<td>*</td>--></tr>
			<tr><th rowspan="3">쭝국</th><td>정산소종</td></tr>
			<tr><!--<td>*</td>--><td>기문</td></tr>
			<tr><!--<td>*</td>--><td>운남</td></tr>
			<tr><th rowspan="4">인도 및 스리랑카</th><td>아삼</td></tr>
			<tr><!--<td>*</td>--><td>실론</td></tr>
			<tr><!--<td>*</td>--><td>다질링</td></tr>
			<tr><!--<td>*</td>--><td>닐기리</td></tr>
		</table>
		
		<hr />
		
		<table border="1">
			<caption>한국의 차</caption>
			<colgroup>
				<col />
				<col />
				<col />
				<col />
				<col />
				<col />
			</colgroup>
			<tr><th colspan="6">한국의 차</th></tr>
			<tr><th rowspan="6">뿌리차</th> <td>인삼차</td> <th rowspan="9">과일차</th> <td>수정과</td> <th rowspan="5">잎차</th> <td>뽕잎차</td></tr>
			<tr><td>당귀차</td> <td>유자차</td> <td>감잎차</td> </tr>
			<tr><td>생강차</td> <td>구기자차</td> <td>솔잎차</td></tr>
			<tr><td>칡차</td> <td>대추차</td> <td>국화차</td></tr>
			<tr><td>둥굴레차</td> <td>오미자차</td> <td>이슬차</td></tr>
			<tr><td>마차</td> <td>매실차</td> <th rowspan="4">기타</th> <td>두충차</td></tr>
			<tr><th rowspan="3">곡물차</th> <td>보리차</td> <td>모과차</td> <td>영지버섯차</td></tr>
			<tr><td>옥수수차</td> <td>산수유차</td> <td>귤강차</td></tr>
			<tr><td>현미차</td> <td>탱자차</td> <td>쌍화차</td></tr>
		</table>
		
		<hr />
		
		<table style="width: 950px; text-align: center" border="1">
			<caption>2013년도 4학년 2학기 강의 시간표</caption>
			<colgroup>
				<col style="width: 5%"/>
				<col style="width: 5%"/>
				<col />
				<col />
				<col />
				<col />
				<col />
				<col />
				<col />
				<col />
			</colgroup>
			<thead><tr><td colspan="2">9.9 ~ 9.20</td><td colspan="6">전남대학교 간호학과</td><td colspan="2">강의실 : 간호관 409호</td></tr></thead>
			<tbody>
				<tr> <th rowspan="2">구분</th>  <th rowspan="2">교시/요일</th>  <th>1</th>  <th>2</th>  <th>3</th>  <th>4</th>  <th>5</th>  <th>6</th>  <th>7</th>  <th>8</th> </tr>
				<tr> <td>8:30-9:20</td>  <td>9:30-10:20</td>  <td>10:30-11:20</td>  <td>11:30-12:20</td>  <td>13:30-24:20</td>  <td>14:30-15:20</td>  <td>15:30-16:20</td>  <td>16:30-17:20</td> </tr>
				<tr> <th rowspan="6">3Q<br />2주<br />*<br />3배</th>  <th rowspan="2">월</th>  <td rowspan="2"> </td>  <td> </td> <td colspan="2">응급 및 재해간호<br />(최순희)</td> <td colspan="2"> </td> <td colspan="2" rowspan="2"> </td> </tr>
				<tr> <td colspan="3">발달장애아동건강간호<br />(정향인)간1-306</td> <td colspan="2">재활간호학<br />(조복희)(9.2-9.25)</td> </tr>
				<tr> <th>화</th>  <td colspan="2">약리학<br />(권신혜 재수강)</td> <td colspan="2"> </td> <td colspan="2"> </td><td colspan="2"> </td></tr>
				<tr> <th>수</th>  <td> </td>  <td colspan="3">보건의료관계법규<br />(김정선)</td> <td>응급 및<br />재해간호<br />(최순희)</td> <td> </td>  <td colspan="2"> </td></tr>
				<tr> <th>목</th>  <td colspan="2"> </td>  <td colspan="2"> </td>  <td colspan="2">재활간호학<br />(조복희)(9.2-9.25)</td> <td colspan="2"> </td></tr>
				<tr> <th>금</th>  <td colspan="4">간호역량평가 1분반<br />(최자윤)-임상입문실습실(204호)</td>  <td colspan="4">간호역량평가 2분반<br />(최자윤)-임상입문실습실(204호)</td></tr>	
			</tbody>
			<tfoot>
				<ul>
					<li>- 추석보강 : 9.23(월)-9.25(수)(3일간)</li>
					<li>- 중간고사 : 9.26(목)-9.27(금)(2일간)</li>
				</ul>
			</tfoot>				
		</table>
		
		<hr />
		
		<table style="width: 350px" border="5" cellpadding="5" cellspacing="0">
			<colgroup>
				<col />
				<col />
				<col />
			</colgroup>
			<caption>내용이 없는 테이블</caption>
			<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
			<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
			<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
		</table>
		
		<!--
			테이블 엑셀처럼 행과 열로 이루어진 그리드에 정보 표시
			정보를 두 축으로 구분해서 복잡한 데이터 표시 그리드의 각 블럭은 테이블 셀이라 한다.
			표를 작성하는 순서는 행을 먼저 정의하고 그 후 내용을 나타내기 위한 열을 정의
			<tr> : 표의 행 정의
			<th> : 제목 열 정의
			<td> : 일반 열 정의			
			th/td 요소에 colspan/rowspan 속성으로 여러 개의 셀을 하나로 결합 할 수도 있다.
			
			계산서처럼 어떤 테이블은 머리말 본문외 에도 꼬리말이 존재한다.
			thead태그로 머리말을 tbody태그로 본문을 tfoot태그로 꼬리말을 나타낼 수 있음.
			
			width 속성 : 테이블 너비 지정
			cellpadding 속성 : 테이블 각 열 내부 여백 지정
			cellspacing 속성 : 테이블 각 열 사이 여백 지정
			하지만, CSS를 사용할 것을 추천			
			border 속성 : 테이블 테두리 지정. 테두리 단위는 픽셀px
		-->

	</body>
</html>
